import React from 'react'
import { getLogin } from '../../api/use'
import {
    Form,
    Input,
    Button,
} from 'antd-mobile'
import { useNavigate } from 'react-router-dom'
const Index = () => {
    const nav=useNavigate()
    const [form] = Form.useForm()
    const onFinish =async (values) => {
        console.log(values);
        const dl=await getLogin(values)
        console.log(dl);
        
        localStorage.setItem('avatar',dl.data.avatar)
        localStorage.setItem('token',dl.data.token)
        localStorage.setItem('id',dl.data.id)
        localStorage.setItem('username',dl.data.username)
        nav('/')
    }
    return (
        <div>
            <div>
                <h2>登录您的12306账号</h2>
                <p>有列高铁成果保证你的账号安全隐私 绝不会透漏你的账号密码</p>
            </div>
            <div>
                <Form
                    form={form}
                    layout='horizontal'
                    onFinish={onFinish}
                    footer={
                        <Button block type='submit' color='primary' size='large' >
                            提交
                        </Button>
                    }
                >
                    <Form.Item
                        name='username'
                        label='账号'
                        rules={[{ required: true, message: '账号不可以为空' }]}
                    >
                        <Input onChange={console.log} placeholder='请输入账号' />
                    </Form.Item>
                    <Form.Item
                        name='password'
                        label='密码'
                        rules={[
                            { required: true, message: '密码不可以为空' },
                            {
                                pattern:/^\d{6}/,
                                message:'密码格式不正确'
                            }
                        ]}
                    >
                        <Input placeholder='请输入密码' />
                    </Form.Item>
                </Form>
            </div>
        </div>
    )
}

export default Index
